.bubble-container {
    display: flex;
    background: none;
    align-items: center;
    height: 40px;
    overflow: visible;
    --bubble-separator-border: none;
}
.bubble-icon {
    display: inline-flex;
    height: auto;
    width: auto;
    margin: 0 22px 0 8px;
}
.bubble-name {
    margin: 0 30px 0 0;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bubble-name:empty {
    display: none;
}

.bubble-line {
    border-radius: 6px;
    margin-right: 14px;
    opacity: 0.6;
    flex-grow: 1;
    height: 6px;
    background-color: var(--bubble-line-background-color, var(--ha-card-background-color, var(--secondary-background-color)));
}

.bubble-sub-button-container {
    margin-left: 8px;
}

.rows-2 .bubble-sub-button-container {
    margin-left: 14px;
}

.large .bubble-container {
    height: calc( var(--row-height,44px) * var(--row-size,0.8) + var(--row-gap,8px) * ( var(--row-size,0.8) - 1 ))
}